<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
	<th:block th:include="include :: header('修改用户头像')" />
	<th:block th:include="include :: cropbox-css" />
</head>
<body class="white-bg" style="margin-top:-10px">
    <div class="container"> 
    <div>
    	<img width="400px" height="400px" id="imageShow" src='/img/profile.jpg'> 
		<form name="form" id="form" method="post" enctype="multipart/form-data" 
		action="/system/appResnetPic/add2" >
			<input id="fileName" type="text" name="fileName" style="visibility: hidden; display: none;" />
		     <input type="file" name="upload" id="upload" style="display: none;"
		         onchange="document.form.path.value=this.value" multiple="multiple" accept=".jpg,.jpeg,.png" />
		     <input name="path" id="path" readonly>
		     <input type="button" value="select local image" onclick="document.form.upload.click()">
		</form>
	</div>
	<!-- <div>
		<a type="button" id="filebutton" onclick="logoUpload.click()" class="btn btn-danger" th:text="#{nsfw.table.button.add}">选择本地jpg图片</a>
	</div> -->
                        
    </div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: cropbox-js" />
<script type="text/javascript">
var cropper;
var file123;
function submitHandler() {
	
	/* var index = parent.layer.getFrameIndex(window.name);
    parent.layer.close(index);
    $.modal.reload(); */
	
	var timestamp = (new Date()).valueOf();
	$("#fileName").val(timestamp+file123);
	$("#form").submit();
	
	 var prefix = ctx + "system/appResnetPic";
	$.ajax({ 
		url : prefix+'/add3',
		type : 'post',
		dataType : 'json',
		cache : false,
		data : {
			fileName : timestamp+file123
		},
		success : function(result) {
			$.operate.saveSuccess(result);
			
		},
		error : function(XMLHttpRequest, textStatus, errorThrown) {
			alert("error");
		}
	}) 
}

$("#upload").change(function() {
	var file = this.files[0];
	var fileName = file.name.toLowerCase();
	var index = fileName.lastIndexOf(".");
	var fileExt = fileName.substring(index);//后缀名  
	file123 = fileExt;
	var allowExt = ".jpg,.jpeg,.png";
	if (allowExt.indexOf(fileExt) == -1) {
		alert('图片格式错误');
		return;
	}
	if (file.size >= 16 * 1024 * 1024) {
		alert('图片文件大小不能大于16M');
		return;
	}
	var reader = new FileReader();
	reader.readAsDataURL(file);//调用自带方法进行转换
	reader.onload = function(e) {
		$("#imageShow").attr("src", this.result);//将转换后的编码存入src完成预览
		//$("#imageBase64").val(this.result);//将转换后的编码保存到input供后台使用
	};
});

</script>
</body>
</html>
